<template>
  <Com class="jimu-sidebar">
    <sidebar-item v-for="(item, index) in data" :key="index"
      :label="item.label"
      :to="item.to"
      :icon="item.icon"
    ></sidebar-item>
  </Com>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import Com from '../../common/Com.vue'
import SidebarItem from './SidebarItem.vue'

export default defineComponent({
  name: 'JimuSidebar',
  components: {Com, SidebarItem},
  props: {
    data: {
      type: Array,
      default(){
        return [
          {
            label: '首页',
            icon: '',
            to: {path: '/'}
          }
        ]
      }
    }
  },
  // setup() {
    
  // },
})
</script>

<style lang="scss" scoped>
.jimu-sidebar{
  box-sizing: border-box;
  width: 50px;
  display: flex;
  flex-direction: column;
  position: fixed;
  z-index: 800;
  top: 50px;
  left: 0;
  border-right: 1px solid #e6e6e6;
  bottom: 0;
  overflow: hidden;
}
</style>